
 

(function (X, $) {

    var tmpl = X.tmpl = {
        coupleListItem: '<tr>\
						<td><i class="icon-minus" title="inactive"></i><i class="icon-resize-small" title="claimed"></i>${Id}</td>\
						<td>${Registrant1FirstName} ${Registrant1LastName}</td>\
						<td>${Registrant2FirstName} ${Registrant2LastName}</td>\
						<td>${EventDate}</td>\
						<td>${EventCity}</td>\
						<td>\
							<a href="#" target="_blank">The Knot</a><br>\
							<a href="#" target="_blank">The Nest</a>\
						</td>\
						<td>\
							<a href="#" target="_blank">Crate and Barrel</a><br>\
							<a href="#" target="_blank">Macy\'s</a>\
						</td>\
						<td>{{if isChosen}}<a href="#" class="btn remove"><i class="icon-remove"></i>remove</a>{{else}}<a href="#" class="btn pick">pick up</a>{{/if}}</td>\
					</tr>',


        popup1: '<div id="${id}" class="modal hide ${className}">\
				<div class="modal-header">\
					<a class="close simplemodal-close" data-dismiss="modal">×</a>\
					<h3>${title}</h3>\
				</div>\
				<div class="modal-body">\
					<div class="loading hidden"></div>\
				</div>\
				<div class="modal-footer">\
					<a href="#" class="btn simplemodal-close" data-dismiss="modal">close</a>\
					<a href="#" class="btn btn-primary">submit</a>\
				</div>\
			</div>',

        popupEdit: '<table id="coupleList" class="table table-striped table-bordered table-condensed tb-couple-list">\
			<tbody>\
				<tr>\
					<td>${userName}</td>\
					<td>Felice Ferro</td>\
					<td>Jun 10, 2012</td>\
					<td>CA</td>\
				</tr>\
			</tbody>\
		</table>\
		<form id="popupEditForm"></form>',

       

        popupClaim: '<p>search by username or email</p>\
		            <form class="well form-inline">\
	                    User ID <input type="text" class="input-small" placeholder="">\
	                    Username <input type="text" class="input-small" placeholder="">\
	                    Email <input type="password" class="input-small" placeholder="">\
	                    <button type="submit" class="btn search">search</button>\
      	            </form>\
      	            <table id="claimSearchList" class="table table-striped table-bordered table-condensed">\
      		            <tr>\
      			            <th>Action</th>\
      			            <th>User ID</th>\
      			            <th>First Name</th>\
      			            <th>Last Name</th>\
      			            <th>Email</th>\
      			            <th>User Type</th>\
      		            </tr>\
      	            </table>',

        popupUnClaim: '<p>really unclaim ?</p>\
                    <div class="control-group">\
			            <label class="control-label" for="textarea">Change Reason</label>\
			            <div class="controls">\
				            <textarea class="input-xlarge" id="textarea" rows="3"></textarea>\
			            </div>\
		            </div>',

        popupClaimSearchListItem: '<tr>\
      			            <td><input type="radio"></td>\
      			            <td>${UserId}</td>\
      			            <td>${Registrant1FirstName}</td>\
      			            <td>${Registrant1LastName}</td>\
      			            <td>${Registrant1Email}</td>\
      			            <td>${UserType}</td>\
      		            </tr>',

        testCoupleListItem: '<tr>\
                <td><i class="icon-minus" title="inactive"></i><i class="icon-resize-small" title="claimed"></i>${Id}</td>\
                <td>${RetailerName}</td>\
                <td>${RetailerBuyUrl}</td>\
                <td>${Category}</td>\
                <td>${Comment}</td>\
                <td><a href="#" class="btn J_edit">edit</a><a href="#" class="btn J_remove">remove</a></td>\
            </tr>'

    }


    var formTmpl = {
        bootstrapItem: '<div class="control-group">\
                  <label class="control-label" for="{{id}}">{{title}}</label>\
                  <div class="controls">\
                    {{editor}} <span class="help">{{help}}</span>\
                  </div>\
                </div>'
    }

    var popupForm = X.popupForm = {

        form: '\
                <form class="form-horizontal">{{fieldsets}}</form>\
            ',
        field: '\
                <div class="control-group field-{{key}}">\
                <label class="control-label" for="{{id}}">{{title}}</label>\
                <div class="controls">\
                    {{editor}}\
                </div>\
                <div class="help-block">{{help}}</div>\
                </div>\
            ',
        date: '\
                <div class="bbf-date">\
                <select data-type="date" class="bbf-date span1">{{dates}}</select>\
                <select data-type="month" class="bbf-month span1">{{months}}</select>\
                <select data-type="year" class="bbf-year span1">{{years}}</select>\
                </div>\
            ',
        status: '\
                <div class="control-group field-{{key}}">\
                <label class="control-label">{{title}}</label>\
                    <div class="controls">\
                        <label class="checkbox">{{editor}} Inactive</label>\
                    </div>\
                </div>',
        objSubTemplate: '\
                <div>{{fieldsets}}</div>\
            ',
        objSubFieldsetTemplate: '\
                <div class="row-fluid show-grid">{{fields}}</div>\
            ',
        objSubFieldTemplate: '\
                <div class="span4">\
                    <p>{{title}}</p>\
                    {{editor}}\
                </div>\
            ',
        checkboxItem: '\
                <label class="checkbox">{{editor}} {{title}}</label>\
            ',
        claim: '\
                <div class="control-group">\
                    <label class="control-label">User</label>\
                    <div class="controls">\
                        None <a href="###" class="btn claim" >claim</a>\
                    </div>\
                </div>',
        unClaim: '\
                <div class="control-group">\
                    <label class="control-label">User</label>\
                    <div class="controls">\
                        {{title}} <a href="###" class="btn unclaim" >unclaim</a>\
                    </div>\
                </div>'
    }

    Backbone.Form.setTemplates(formTmpl);
})(XO, $);
